<template>
  <!-- 物流单页面 -->
  <div>
    <div class="box111">
      <ul class="myul">
        <li><van-icon name="arrow-left" /></li>
        <li>快递单</li>
        <li><img src="../assets/个人中心/形状 557.png" alt="" /></li>
      </ul>
    </div>
    <form action="/">
      <van-search
        v-model="value"
        show-action
        placeholder="请输入搜索关键词"
        @search="onSearch"
        @cancel="onCancel"
        action-text="搜索"
      />
    </form>
    <div class="box" v-for="item in records" :key="item.id">
      <van-row>
        <van-col span="12">快递单号：{{item.orderCode}}</van-col>
      </van-row>
      <div class="app">
        <div class="app-1">
          <img src="../assets/发货单图标/xiangji.png" alt="" />
        </div>
        <div class="app-2">
          <ul>
            <li>{{item.createTime}}</li>
            <li>{{item.consignee}}</li>
            <li>{{item.consignor}}</li>
          </ul>
        </div>
      </div>
      <van-button round @click="addStar(item.star,item.id,item.orderCode)">{{item.star==0?'否':'已经评价'}}</van-button>
    </div>
  </div>

  <!-- 

records: Array(40)
0:
belongUser: "1354275382904549377"
consignee: "大宝剑"
consignor: "郎柏"
createTime: "2021-01-28 10:22:00"
express: 3
id: "1354615678955773957"
images: []
imgs: (3) ["https://wx3.sinaimg.cn/large/0071noTCgy1gj9m2ov2tuj30g00shn26.jpg", "https://timgsa.baidu.com/timg?image&quality=80&siz…F20201001%2F0cb3874405f745689ff0347d65df37ca.jpeg", "https://wx4.sinaimg.cn/large/0071noTCgy1gj9m2q7kn6j30g00sh7io.jpg"]
info: "写几句评论"
logistics: 3
orderCode: "1354615678754447601"
shop: 3
star: 1
starTime: "2021-02-05 17:19:12"
state: 0
totalScore: 3
__proto__: Objectrecords: Array(40)
0:
belongUser: "1354275382904549377"
consignee: "大宝剑"
consignor: "郎柏"
createTime: "2021-01-28 10:22:00"
express: 3
id: "1354615678955773957"
images: []
imgs: (3) ["https://wx3.sinaimg.cn/large/0071noTCgy1gj9m2ov2tuj30g00shn26.jpg", "https://timgsa.baidu.com/timg?image&quality=80&siz…F20201001%2F0cb3874405f745689ff0347d65df37ca.jpeg", "https://wx4.sinaimg.cn/large/0071noTCgy1gj9m2q7kn6j30g00sh7io.jpg"]
info: "写几句评论"
logistics: 3
orderCode: "1354615678754447601"
shop: 3
star: 1
starTime: "2021-02-05 17:19:12"
state: 0
totalScore: 3
__proto__: Object

   -->
</template>

<script>
import {starData} from '../request/api'
export default {
  data() {
    return {
      value: "",
      keyword:'',
      records:[],
      id:'',
      orderCode:''
    };
  },
  methods: {
    onSearch(val) {
      console.log(val);
      this.keyword=val
    },
    onCancel() {
      Toast("搜索");
    },
    addStar(val,id,orderCode){
      console.log(id,orderCode);
        if(val==0){
            this.$router.push(`/starchild?id=${id}&orderCode=${orderCode}`)
        }else{
            this.$router.push(`/starchilder?id=${id}`)
        }
        
    }
  },
  created(){
      starData({
          keyword:this.keyword,
          current:'1',
          size:'100'
      }).then(res=>{
          console.log(res);
          this.records=res.data.records
          this.id=res.data.records.id
          this.orderCode=res.data.records.orderCode
      })
  }
};
</script>
 
<style lang = "less" scoped>
.box111 {
  height: 60px;
  /* background-color: blue; */
  line-height: 60px;
  .myul {
    display: flex;
    justify-content: space-around;
    img {
      width: 25px;
      height: 25px;
      /* margin-bottom: 5px; */
      margin-top: 15px;
    }
  }
}
.box {
  .van-row {
    padding: 10px;
  }
  .app {
    text-align: right;
  }
  .van-button {
    width: 100px;
    margin-right: 10px;
    height: 40px;
    background-color: yellow;
    margin: 10px 0;
    margin-left: 300px;
  }
}
.app {
  display: flex;
  .app-1 {
    padding: 20px;
  }
  .app-2 {
    line-height: 35px;
    text-align: left;
  }
}
.van-col--12{
    width: 100%;
}
</style>